<template>
  <div>
    <!-- {{ record }} -->

    <van-cell is-link :to="url_for_form">
      <template #title>
        <template v-for="(item, index) in node.children">
          <template v-if="item.attrs.name === 'title'">
            <ONode
              :key="index"
              :data-info="dataInfo"
              :view-info="{ ...viewInfo, node: item }"
            />

            <!-- :editable="editable"  -->
            <!-- :loading="loading" -->
            <!-- @on-event="handleOnEvent" -->
          </template>
        </template>
      </template>

      <template #label>
        <template v-for="(item, index) in node.children">
          <template v-if="item.attrs.name === 'label'">
            <ONode
              :key="index"
              :data-info="dataInfo"
              :view-info="{ ...viewInfo, node: item }"
            />
          </template>
        </template>
      </template>

      <template>
        <template v-for="(item, index) in node.children">
          <template v-if="item.attrs.name === 'default'">
            <ONode
              :key="index"
              :data-info="dataInfo"
              :view-info="{ ...viewInfo, node: item }"
            />
          </template>
        </template>
      </template>
    </van-cell>

    <!-- <van-cell :title="record.name" :value="`¥${record.lst_price}`" is-link /> -->
  </div>
</template>

<script>
import api from '@/odooapi'

import ONode from '@/components/ONode/ONode'

// eslint-disable-next-line no-unused-vars
const cp = val => JSON.parse(JSON.stringify(val))
export default {
  name: 'TreeCell',
  components: { ONode },
  mixins: [],

  props: {
    viewInfo: {
      type: Object,
      default: () => {
        return {}
      }
    },

    dataInfo: {
      type: Object,
      default: () => {
        return {}
      }
    }
  },

  data() {
    return {}
  },

  computed: {
    record() {
      return this.dataInfo.record || {}
    },
    node() {
      return api.Views.list.view_node(this.viewInfo)
    },

    url_for_form() {
      const { action } = this.viewInfo
      const { id: res_id } = this.record
      return {
        path: '/web',
        query: { action: action.id, id: res_id, view_type: 'form' }
      }
    }
  },

  created() {
    console.log(this.viewInfo, cp(this.node))
  },

  methods: {}
}
</script>

<style scoped></style>
